<template>
  <a-modal
    :title="'历史版本'"
    :visible="visible"
    width="50%"
    :footer="null"
    @cancel="reset"
  >
    <a-table
      :columns="columns"
      :data-source="dataList"
      bordered
      :pagination="pagination"
      @change="handleTableChange"
    >
      <template
        slot="image"
        slot-scope="txt, record"
      >
        <img
          v-for="(item, index) in record.imgUrls"
          :key="`${record.id}-${index}`"
          style="width:50px;height:50px;margin-right: 10px;"
          :src="item"
          alt=""
        />
      </template>
      <span
        slot="type"
        slot-scope="text,record"
      >
        <span v-if="record.currentEdition == 0">否</span>
        <span v-else>是</span>
      </span>
      <template
        slot="action"
        slot-scope="txt, record"
      >
        <a-button
          type="primary"
          v-if="record.currentEdition == 0"
          @click="enable(record)"
        >启用</a-button>
      </template>
    </a-table>
    <a-row>
      <a-col
        :span="24"
        :offset="22"
      >
        <a-button
          type="primary"
          @click="reset"
        >返回</a-button>
      </a-col>
    </a-row>
  </a-modal>
</template>
<script>
import { postAction } from '@/api/manage'
import { pattern, examineCheck } from '@api/pattern/index'
const columns = [
  {
    title: '版本号',
    dataIndex: 'edition',
  },
  {
    title: '颜色id',
    dataIndex: 'patternColorId',
  },
  {
    title: '图片',
    scopedSlots: { customRender: 'image' },
  },
  {
    title: '是否当前版本',
    dataIndex: 'currentEdition',
    scopedSlots: { customRender: 'type' },
    // customRender: (text) => text === 0 ? '否' : '是',
  },
  {
    title: '创建时间',
    dataIndex: 'createDate',
  },
  {
    title: '操作',
    width: 100,
    scopedSlots: { customRender: 'action' },
  },
]
export default {
  props: {
    color: {
      type: Object,
      default: null,
    },
    patternId: {
      type: [Number, String],
      default: '',
    },
  },
  data() {
    return {
      visible: true,
      urlKey: 'edition',
      columns,
      dataList: [],
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '40'],
        showQuickJumper: true,
        showSizeChanger: true,
        showTotal: (total) => `共 ${total} 条记录`,
        itemRender: (current, type, originalElement) => {
          if (type === 'prev') {
            return <a>上一页</a>
          } else if (type === 'next') {
            return <a>下一页</a>
          }
          return originalElement
        },
      },
    }
  },
  mounted() {
    this.loadData()
  },
  computed: {
    jobNumber() {
      return this.$store.getters.userInfo.workNo || ''
    },
  },
  methods: {
    handleTableChange(pagination) {
      console.log('gaibian', pagination)
      this.pagination = pagination
      this.loadData()
    },
    reCalculatePage(count) {
      //总数量-count
      let total = this.pagination.total - count
      //获取删除后的分页数
      let currentIndex = Math.ceil(total / this.pagination.pageSize)
      //删除后的分页数<所在当前页
      if (currentIndex < this.pagination.current) {
        this.pagination.current = currentIndex
      }
      console.log('currentIndex', currentIndex)
    },
    loadData(arg) {
      if (!this.urlKey || this.urlKey == '') {
        this.$message.error('请设置url.list属性!')
        return
      }
      if (arg === 1) {
        this.pagination.current = 1
      }
      console.log(typeof this.color.patternId)
      const { current, pageSize: size } = this.pagination
      var params = {
        // name:this.color.name,
        colorId: this.color.colorId,
        current,
        size,
      }
      postAction(`${pattern}${this.urlKey}/list`, params).then((res) => {
        if (res.code == 200) {
          this.dataList = res.data.records || res.data

          if (res.data.total) {
            this.pagination.total = res.data.total
          } else {
            this.pagination.total = 0
          }
        } else {
          this.$message.warning(res.msg)
        }
        this.loading = false
      })
    },
    enable(val) {
      console.log(val)
      var params = {
        id: val.id,
        patternColorId: val.patternColorId,
        jobNumber: this.jobNumber,
      }
      const checkParams = {
        colorId: val.patternColorId,
        imageList: val.imgUrls,
        patternId: val.id,
        scene: 3,
      }
      postAction(`${pattern}pattern/examine/check`, checkParams).then((res) => {
        if (res.code != 200) {
          this.$confirm({
            content: res.msg,
            onOk: () => {
              postAction(`${pattern}${this.urlKey}/open`, params).then((res) => {
                if (res.code == 200) {
                  this.loadData()
                  this.$message.success('启用成功')
                } else {
                  this.$message.warning(res.msg)
                }
                this.loading = false
              })
              const initParams = {
                colorId: val.patternColorId,
                patternId: val.id,
                scene: 3,
                jobNumber:this.jobNumber
              }
              postAction(`${pattern}pattern/examine/init`, initParams).then((res) => {
                if ((res.data = 200)) {
                  this.$message.success('图案审核/批注状态已重置')
                }
              })
            },
          })
        } else {
          postAction(`${pattern}${this.urlKey}/open`, params).then((res) => {
            if (res.code == 200) {
              this.loadData()
              this.$message.success('启用成功')
            } else {
              this.$message.warning(res.msg)
            }
            this.loading = false
          })
        }
      })
    },
    reset() {
      this.loading = false
      this.$emit('close')
    },
  },
}
</script>

